<template>
    <section id="Edit">
        <p>请认真填写以下信息，以便潜在客户顺利找到您</p>
        <section class="userInfo_body">
            <section class="info_group">
                <section class="info_item">
                    <span>ID</span>
                    <span class="input_name">
                        <input type="text" value="" id="" placeholder="" />
                    </span>
                </section>
                <section class="info_item">
                    <span>姓名</span>
                    <span class="input_name">
                        <input type="text" value="" id="" placeholder="输入您的真实姓名" />
                    </span>
                </section>
                <section class="info_item">
                    <span>昵称</span>
                    <span class="input_name">
                        <input type="text" value="" id="" placeholder="输入您的昵称" />
                    </span>
                </section>
                <section class="info_item">
                    <span>手机</span>
                    <span class="input_name">
                        <input type="text" value="" id="" placeholder="输入您的手机号" />
                    </span>
                </section>
                <section class="info_item">
                    <span>职级</span>
                    <span class="input_name">
                        <input type="text" value="" id="" placeholder="" />
                    </span>
                </section>
                <section class="info_item">
                    <span>地址</span>
                    <span class="input_name">
                        <input type="text" value="" id="" placeholder="请填写您的地址" />
                    </span>
                </section>
                <section class="info_item">
                    <span>签名</span>
                    <span class="input_name">
                        <textarea class="weui-textarea" placeholder="说说您的辉煌经历吧" rows="3"></textarea>
                        <div class="weui-textarea-counter"><span>0</span>/50</div>
                    </span>
                </section>
                <router-link to="/user" class="weui-btn weui-btn_primary">保存</router-link>
            </section>
        </section>
    </section>
</template>
<style scoped>
#Edit {
    padding: .8rem;
    background: #f6f6f6;
    box-sizing: border-box;
}

.userInfo_body {
    margin-top: .5rem;
    box-sizing: border-box;
    background: #FFF;
    padding: 1rem;
    border-radius: .3rem;
    box-shadow: .2rem .2rem 1rem #ddd;
}

.info_item {
    display: flex;
    flex-direction: row;
    border-bottom: 1px solid #D5D5D5;
    padding-top: .45rem;
    padding-bottom: .25rem;
}

.info_item>span:nth-child(1) {
    font-size: .7rem;
    display: block;
    flex: 2;
}

.info_item>span:nth-child(2) {
    display: block;
    flex: 5;
}
.info_item>span:nth-child(2)>input{
    height: 100%;
    width: 100%;
    border: none;
}
::-webkit-input-placeholder{
    color: #ccc;
    font-size: .75rem;
    font-weight: 400;
}
</style>
